layui.define(['table','tree'],function(exports){
  "use strict";
  var $ = layui.$
    ,table = layui.table
    // ,form = layui.form
    ,tree = layui.tree;

  var randomId = Math.floor(Math.random()*100000 + 1);
  var formId = 'form_' + randomId;
  var tableElemId = 'popTable_' + randomId;
  var treeElemId = 'popTree_' + randomId;
  var keywordsId = 'keywords_' + randomId;

  //设置默认配置
  var defaultOption = {
    title: undefined
    ,area: ['1000px','530px']
    ,offset: '100px'
    ,fixed: false
    ,success: undefined
    ,queryField: 'keyword'
    ,formFilter: formId
    ,done: function (obj) {
      
    }
    ,table:{
      url:undefined
      ,cols:[]
      ,page: true
      ,limit: 10
      ,limits: [10, 15, 20, 25, 30]
      ,size: 'sm'
      ,request: {pageName: 'pageNo',limitName: 'pageSize'}
      ,joinField: undefined
    }
    ,tree:{
      url: undefined
      ,title:'分类列表'
      ,type: 'get'
      ,isJump: true
      ,onlyIconControl: true
      ,joinField:'id'
    }

  };

  //增加属性
  var popTreeTable = {
    open:function(options){

      var treeOptions = $.extend({},defaultOption.tree,options.tree);
      var tableOptions = $.extend({},defaultOption.table,options.table);
      var options = $.extend({},defaultOption,options);

      var popContent = [
        '<div class="layui-form" lay-filter="'+options.formFilter+'" style="margin: 5px;">'
        ,'<div class="layui-row layui-col-space10">'
        ,'<div class="layui-block">'
        ,'<input class="layui-input" name="'+keywordsId+'" id="'+keywordsId+'" placeholder="请输入关键字" autocomplete="off">'
        ,'</div>'
        ,'</div>'
        ,'<div class="layui-row layui-col-space10" style="background-color:#fff;">'
        ,'<div class="layui-col-md4">'
        ,'<div class="layui-collapse">'
        ,'<div class="layui-colla-item">'
        ,'<h2 class="layui-colla-title" style="height: 32px;line-height:32px;padding-left:15px;">'+treeOptions.title+'</h2>'
        ,'<div id="'+treeElemId+'"></div>'
        ,'</div>'
        ,'</div>'
        ,'</div>'
        ,'<div class="layui-col-md8">'
        ,'<table id="'+tableElemId+'" lay-filter="'+tableElemId+'"></table>'
        ,'</div>'
        ,'</div>'
        ,'</div>'
        ,'<script type="text/html" id="lay-toolbar">'
        ,'<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="selected"><iclass="layui-icon layui-icon-ok-circle"></i>选择</a>'
        ,'</script>'
      ].join('');

      var index = layer.open({
        type: 1
        ,title: options.title
        ,content:popContent //不允许出现滚动条
        ,area: options.area
        ,offset: options.offset
        ,fixed: options.fixed
      });

      //设置左右两边高度相等
      // $(".layui-collapse").css("height", $('.layui-table-view').height());

      //加载右边表格信息
      table.render({
        elem: '#' + tableElemId
        , url: tableOptions.url
        , request: tableOptions.request
        , cols: tableOptions.cols
        , page: tableOptions.page
        , limit: tableOptions.limit
        , limits: tableOptions.limits
        , size: tableOptions.size
      });

      //获取树
      function getTree(id) {
        var result = '';
        $.ajax({
          url: treeOptions.url
          ,data: {id: id}
          ,type: treeOptions.type
          ,dataType: 'text'
          ,async: false   //同步返回数据
          ,success: function (res) {
            result = res;
          }
        });
        // var obj2 = eval('(' + result + ')');  //这里有时候报错！！！
        var obj2 = JSON.parse(result);
        console.log(obj2);
        return obj2.data;
      };

      tree.render({
        elem: '#' + treeElemId
        ,isJump: treeOptions.isJump
        ,onlyIconControl: treeOptions.onlyIconControl
        ,data: getTree(null)
        ,click: function(obj){
          table.reload(tableElemId, {where: {[tableOptions.joinField]: obj.data[treeOptions.joinField], [options.queryField]: null}, page: {curr: 1}});
        }
      });

      //-------------------- 表格的监听 start ----------------
      //监听行工具条 - 选择
      table.on('tool('+tableElemId+')', function (obj) {
        var selected = obj.data;
        var layEvent = obj.event;
        if (layEvent === 'selected') {
          options.done(selected);
          layer.close(index);
        }
      });

      table.on('rowDouble('+tableElemId+')', function (obj) {
        var selected = obj.data;
        options.done(selected);
        layer.close(index);
      });

      //-------------------- 表格的监听 end -------------------


      //搜索输入框的值改变时，触发实时查询
      $("#"+keywordsId).on("input",function(e){
          var queryValue = e.delegateTarget.value;
          table.reload(tableElemId, {where: {[tableOptions.joinField]: null, [options.queryField]: queryValue}, page: {curr: 1}});
      });

    }


  };
  exports('popTreeTable', popTreeTable);

});